import { userInfoTpl } from './template'

export function observer(userInfo, viewDom) {
  // 获取之前存储的数据
  var _storageInfo = JSON.parse(localStorage.getItem('userInfo') || '{}');
  // 定义一个存储空间
  var _retInfo = {};
  // 初始化数据
  var init = function() {
    initData(_storageInfo, _retInfo, userInfo);
    initDom(_retInfo, viewDom);
  }

  function initData(storageInfo, retInfo, userInfo) {
    for (var k in storageInfo) {
      if (!userInfo[k]) { // 如果当前传进来的数据里不存在于本地存储里则赋值
        userInfo[k] = storageInfo[k];
      }
    }

    for (var k in userInfo) { // 遍历 监听 userInfo里的属性
      (function(k) {
        Object.defineProperty(retInfo, k, {
          get() {
            return userInfo[k];
          },
          set(newVal) {
            userInfo[k] = newVal;
            localStorage.setItem('userInfo', JSON.stringify(userInfo));
            document.querySelector(`.__${k}`).innerHTML = userInfo[k];
          }
        })
      })(k);
    }
  }

  function initDom(retInfo, dom) {
    dom.innerHTML = userInfoTpl(retInfo);
  }

  init();

  return _retInfo;
}